//created by: Justina Lee

Ext.define("MajorProjectSenchaTouch.view.EResourcesModule.EResourcesMusicList", {
    extend:'Ext.List',
    xtype: 'eResourcesMusicList',
    id: 'eRMusicList',
    cls: 'x-list',
    requires:[
    'MajorProjectSenchaTouch.store.EResourcesMusic'
    ],
    config:{
        grouped: true,
        itemTpl: new Ext.XTemplate(             
            '<tpl for=".">',
            '<article class="wrapper" style="{[this.backgroundColor(values.xindex)]}">',
                '<aside class="imageWrapper"><img src="{image}"></aside>',
                '<section class="contentWrapper" style="{[this.contentBackgroundColor(values.xindex)]}">',
                    '<header class="titleHeader">',
                        '<h2>{ name }</h2>',
                    '</header>',
                    '<section class="contentDescription">',
                        '<h4>{description}</h4>',                        
                    '</section>',
                    '<section class="urlWrapper">',                                              
                        '<div class="urlContainer">',
                            '<tpl for="eResourcesUrls">',
                                '<tpl if="xcount &gt; 1">',
                                    '<input type="button" id="urlBtn" value= "{[this.getUrlText(values.url)]}" onclick="{[ this.getUrl(values.url) ]}" />',
                                '<tpl else>',
                                    '<input type="button" id="urlBtn" value="Visit URL" onclick="{[ this.getUrl(values.url) ]}" />',
                                '</tpl>',
                            '</tpl>',
                        '</div>',                        
                    '</section>',
                '</section>',
            '</article>',
             '</tpl>',            
            {
                compiled: true,
                //returns database's url text e.g. http://ezproxy.tp.edu.sg:2048/login/sto10 returns sto10
                getUrlText : function(value){
                    return value.substr(value.lastIndexOf("/")+1);
                },
                //checks the xindex and returns the correct background color (alternate color)
                backgroundColor : function(position){
                    var color = "background-color: white;";
                    if(position % 2 == 0){
                        color = "background-color: #E6E6E5";
                    }                    
                    return color;
                },
                //checks the xindex and returns the correct background color (alternate color)
                contentBackgroundColor : function(position){
                    var color = "background-color: #E6E6E5;";
                    if(position % 2 == 0){
                        color = "background-color: white";
                    }                    
                    return color;
                },
                //onclick function to do window.open
                getUrl : function(url){
                    var a = 'window.open(\'';
                    var b = '\')';
                    var retValue = a+url+b;
                    
                    return retValue;
                }
            }
            ),
        store:'EResourcesMusic',
        listeners:{
            painted : function(){
                this.refresh();
                this.fireEvent('loadEResourcesMusic', this);
            }
        }        
    }
});
